import { useNavigation } from '@react-navigation/native'
import { Link, router, Redirect } from 'expo-router'
import { StyleSheet, Alert, Text, View, Button, Image, ScrollView, Switch, TouchableOpacity } from 'react-native'
import React, { useState } from 'react'
import axiosApi from '../zhcFile/axiosApi/axiosApi'
import { login } from '../zhcFile/services/hotTrack.d'
import AsyncStorage from '@react-native-async-storage/async-storage';
export default function User() {
  const navigation = useNavigation()

  const [isEnabled, setIsEnabled] = useState(false);

  const toggleSwitch = () => setIsEnabled(previousState => !previousState);

  const handlePress = () => {
    router.push('/MyViews/SetUp');
  }
  const handlePress1 = () => {
    router.push('/zhcFile/feedback');
  }
  const handlePress2 = () => {
    router.push('/MyViews/download');
  }
  const GoOut = () => {
    // 弹窗确认退出
    Alert.alert("确定要退出登录吗？",
      "",
      [
        {
          text: "取消",
          onPress: () => console.log("取消"),
          style: "cancel"
        },
        {
          text: "确定",
          onPress: () => {
            // 退出登录操作
            console.log("确定");
            // 清除用户信息
            // 跳转到登录页面
            // router.push('/Login');
          }
        }
      ]
    )
  }

  //模拟登录
  const Login = async () => {
    const res: any = await login({ users: 'admin', password: '123456' })
    if (res.data.code === 200) {
      console.log(res.data.user)
      // 登录成功，保存用户信息
      // router.push('/MyViews/MyPage');
      // rn保存信息持久化
      storeData('user', res.data.user)
    }
  }
  //模拟登录
  const Login1 = async () => {
    const res: any = await login({ users: 'xiaoliu', password: '111111' })
    if (res.data.code === 200) {
      console.log(res.data.user)
      // 登录成功，保存用户信息
      // router.push('/MyViews/MyPage');
      // rn保存信息持久化
      storeData('user', res.data.user)
    }
  }
  const storeData = async (key: string, value: any) => {
    try {
      await AsyncStorage.setItem(key, JSON.stringify(value));
    } catch (error) {
      console.error('Failed to save data', error);
    }
  };

  return (
    <View>
      <ScrollView>
        <View style={styles.body56}>
          <View style={styles.img}>
            <View style={styles.ce}></View>
          </View>
          <View style={styles.q1}>
            <View style={{ marginTop: "15" }}>
              <Text style={{ color: "#999999" }}>
                张三                                                      .
                <TouchableOpacity onPress={handlePress}>
                  <Image
                    source={require("../../assets/images/sheZhi.png")}
                    style={styles.img3434}
                  ></Image>
                </TouchableOpacity>


              </Text>
              <Text style={{ color: "#999999", marginTop: "10" }} >12121212</Text>
            </View>
          </View>
        </View>
        <View style={styles.Zhong}>
          <Text style={{ marginLeft: "10" }}>
            <Text>
              <Image
                source={require("../../assets/images/XiaZai.png")}
                style={{ width: "20", height: "20", marginLeft: "10" }}
              ></Image>
            </Text>
            <TouchableOpacity onPress={handlePress2}>
              <Text style={{ justifyContent: "center" }}>    我的下载                                                                > </Text>
            </TouchableOpacity>

          </Text>
        </View>
        <View style={styles.Zhong1}>
          <Text style={{ marginLeft: "10" }}>
            <Text>
              <Image
                source={require("../../assets/images/XiaoXi.png")}
                style={{ width: "20", height: "20", marginLeft: "10" }}
              ></Image>
            </Text>
            <Text style={{ justifyContent: "center" }} onPress={() => {
              router.push('/MyViews/information');
            }}>    我的消息                                                                > </Text>
          </Text>
        </View>
        <View style={styles.Zhong1}>
          <Text style={{ marginLeft: "10" }}>
            <Text>
              <Image
                source={require("../../assets/images/GuanZhu.png")}
                style={{ width: "20", height: "20", marginLeft: "10" }}
              ></Image>
            </Text>
            <Text style={{ justifyContent: "center" }}>    我的关注                                                                > </Text>
          </Text>
        </View>
        <View style={styles.Zhong1}>
          <Text style={{ marginLeft: "10" }}>
            <Text>
              <Image
                source={require("../../assets/images/ShouCang.png")}
                style={{ width: "20", height: "20", marginLeft: "10" }}
              ></Image>
            </Text>
            <Text style={{ justifyContent: "center" }}>    我的收藏                                                                > </Text>
          </Text>
        </View>
        <View style={styles.Zhong}>
          <Text style={{ marginLeft: "10" }}>
            <Text>
              <Image
                source={require("../../assets/images/yijian.png")}
                style={{ width: "20", height: "20", marginLeft: "10" }}
              ></Image>
            </Text>
            <Text style={{ justifyContent: "center" }}>    意见反馈                                                                > </Text>
          </Text>
        </View>
        <View style={styles.Zhong1}>
          <Text style={{ marginLeft: "10" }}>
            <Text>
              <Image
                source={require("../../assets/images/zitongtognzhi.png")}
                style={{ width: "20", height: "20", marginLeft: "10" }}
              ></Image>
            </Text>
            <TouchableOpacity onPress={handlePress1}>
              <Text style={{ justifyContent: "center" }}>    系统通知                                                                > </Text>
            </TouchableOpacity>
          </Text>
        </View>
        <View style={styles.Zhong1}>
          <Text style={{ marginLeft: "10" }}>
            <Text>
              <Image
                source={require("../../assets/images/tuisong.png")}
                style={{ width: "20", height: "20", marginLeft: "10" }}
              ></Image>
            </Text>
            <Text style={{ justifyContent: "center" }}>    内容推送                                                                > </Text>
          </Text>
        </View>
        <View style={styles.button}>
          <Button
            title="退出登录"
            onPress={() => {
              GoOut()
            }}
          ></Button>
        </View>
        <View style={styles.button}>
          <Button
            title="登录"
            onPress={() => {
              Login()
            }}
          ></Button>
        </View>
        <View style={styles.button}>
          <Button
            title="登录2"
            onPress={() => {
              Login1()
            }}
          ></Button>
        </View>
      </ScrollView>

    </View>
  )
}

const styles = StyleSheet.create({
  body56: {
    height: 150,
    backgroundColor: '#ffffff',
    marginTop: "1.5",
    flexDirection: "row",
  },
  img: {
    width: "20%",
    height: "55%",
    borderRadius: "50",
    marginTop: "30",
    justifyContent: "center",
    alignItems: "center"
  },
  q1: {
    width: "80%",
    marginLeft: "1.5",
    marginTop: "1.5",
    padding: "20",
    fontSize: "13",
  },
  ce: {
    width: "70%",
    height: "70%",
    backgroundColor: "red",
    borderRadius: "50%",
  },
  img3434: {
    width: "23",
    height: "23",
  },
  Zhong: {
    height: "40",
    marginTop: "20",
    backgroundColor: "#ffffff",
    justifyContent: "center",

  },
  Zhong1: {
    height: 45,
    marginTop: 1,
    backgroundColor: "#ffffff",
    justifyContent: "center",

  },
  Zhong11: {
    height: "40",
    marginTop: "1",
    backgroundColor: "#ffffff",
    justifyContent: "center",
    flexDirection: "row",
  },
  button: {
    padding: "20",
  }
})